<template>
  <div>
    <div id="prescription_message_title">&nbsp;&nbsp;
      <span>订单信息</span>
    </div>
    <div id="prescription_message_div">
      <div id="prescription_message_1">
        <div class="prescription_message_1">订单编号：{{prescriptionOrder.num}}</div>
        <div class="prescription_message_1">状态：
          <template :slot-scope="prescriptionOrder">
            <span v-if="+prescriptionOrder.status === 1">待支付</span>
            <span v-if="+prescriptionOrder.status === 2">已完成</span>
            <span v-if="+prescriptionOrder.status === 3">已失效</span>
            <span v-if="+prescriptionOrder.status != 1 && +prescriptionOrder.status !=2 && +prescriptionOrder.status != 3">-</span>
          </template>
        </div>
        <div class="prescription_message_1">购药方式：{{prescriptionOrder.buyway}}</div>
      </div>
      <div id="prescription_message_2">
        <div class="prescription_message_2">应付金额：￥{{prescriptionOrder.price}}</div>
        <div class="prescription_message_2">实付金额：￥{{prescriptionOrder.price}}</div>
      </div>
      <div id="prescription_message_3">创建时间：{{prescriptionOrder.time}}</div>
      <div id="prescription_message_3">支付方式：</div>
      <div id="prescription_message_3">支付时间：</div>
    </div>
  </div>
</template>

<script>
export default {
  name: "PrescriptionOrderMessage",
  props: {
    prescriptionOrder: ''
  },
}
</script>

<style scoped>
#prescription_message_title {
  margin-right: 200px;
  margin-top: 20px;
  height: 50px;
  font-size: 20px;
  line-height: 50px;
  background-color: rgb(241, 241, 241);
}
#prescription_message_div {
  border: 1px solid rgb(216, 216, 216);
  margin-right: 200px;
  overflow: hidden;
}
#prescription_message_1,
#prescription_message_2 {
  float: left;
  width: 100%;
}
.prescription_message_1,
.prescription_message_2 {
  float: left;
  width: 300px;
  margin-top: 10px;
  margin-left: 20px;
  margin-bottom: 10px;
}
#prescription_message_3 {
  float: left;
  width: 90%;
  margin-left: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  overflow: hidden;
}
</style>
